<div>
	<juci-config-lines>
		<juci-config-line title="{{'Enabled'|translate}}" help="{{'Turn this wireless network on/off'|translate}}">
			<switch ng-model="iface.disabled.value" class="green" inverted></switch>
		</juci-config-line>
	</juci-config-lines>
	<juci-config-lines ng-hide="iface.disabled.value">
		<juci-config-line title="{{'SSID'|translate}}" help="{{'Wireless network ID'|translate}}">
			<input type="text" class="form-control" placeholder="Wifi Name" ng-model="iface.ssid.value" maxlength="32"/>
		</juci-config-line>
		<juci-config-line title="{{'Broadcast SSID'|translate}}" help="{{'Disable to hide SSID'|translate}}">
			<switch id="enabled" name="enabled" ng-model="iface.hidden.value" on-change="onShowSSIDToggle()" class="green" inverted></switch>
		</juci-config-line>
		<juci-config-line title="{{'Encryption'|translate}}" help="{{'Choose between supported encryption modes and cyphers'|translate}}">
			<juci-select ng-model="iface.encryption.value" ng-items="cryptoChoices" placeholder="{{'Choose Encryption'|translate}}" on-change="onEncryptionChanged($value, $oldvalue)"/>
		</juci-config-line>
		<div ng-show="iface.encryption.value.indexOf('psk') == 0">
			<juci-config-line title="{{'Key'|translate}}" help="{{'Preshared key/passphrase'|translate}}">
				<div class="input-group">
					<input type="{{(!showPassword)?'password':'text'}}" class="form-control" placeholder="{{'Key'|translate}}" ng-model="iface.key.value" />
					<span style="cursor: pointer;" title="{{'Reset to default password'|translate}}" class="input-group-addon" id="basic-addon1" ng-click="iface.key.value = default_key"><i class="fa fa-rotate-left"></i></span>
				</div>
				<div class="checkbox checkbox-info">
					<input type="checkbox" ng-model="showPassword" ng-click="toggleShowPassword()"/>
					<label><strong>{{'Show Password'|translate}}</strong></label>
				</div>
			</juci-config-line>
		</div>
		<div ng-show="iface.encryption.value.indexOf('wep') == 0">
			<juci-config-line title="{{'Key'|translate}}" help="{{'Primary key index'|translate}}">
				<juci-select ng-model="iface.key_index.value" ng-items="keyChoices" placeholder="{{'Choose Key'|translate}}"/>
			</juci-config-line>
			<juci-config-line ng-repeat="key in ['1', '2', '3', '4']" 
				title="{{'Key'|translate}} {{key}}">
				<input type="{{(!showPassword)?'password':'text'}}" class="form-control" placeholder="{{('Key'+key)|translate}}" ng-model="iface['key'+key].value" />
			</juci-config-line>
			<juci-config-line>
				<div class="checkbox checkbox-info">
					<input type="checkbox" ng-model="showPassword" ng-click="toggleShowPassword()"/>
					<label><strong>{{'Show Password'|translate}}</strong></label>
				</div>
			</juci-config-line>
		</div>
		<div ng-show="iface.encryption.value.indexOf('wpa2') == 0">
			<juci-config-line title="{{'Radius Server'|translate}}" help="{{'RADIUS server address'|translate}}">
				<input type="text" class="form-control" placeholder="{{'wifi-iface.radius_server'|translate}}" ng-model="iface.radius_server.value" />
			</juci-config-line>
			<juci-config-line title="{{'Radius Port'|translate}}" help="{{'RADIUS port number'|translate}}">
				<input type="text" class="form-control" placeholder="{{'wifi-iface.radius_port'|translate}}" ng-model="iface.radius_port.value" />
			</juci-config-line>
			<juci-config-line title="{{'Radius Secret'|translate}}" help="{{'RADIUS authentication secret'|translate}}">
				<input type="{{(!showPassword)?'password':'text'}}" class="form-control" placeholder="{{'wifi-iface.radius_secret'|translate}}" ng-model="iface.radius_secret.value" />
			</juci-config-line>
		</div>
	</juci-config-lines>
</div>
